/** 
 * Nav Skin
 *
 * Remove this if you want it to be the default bluish looking style.  If you want
 * to change the images, you need to copy those CSS declarations from the snapfish.css
 * file and change them here so you don't change the original.
 * See: http://users.tpg.com.au/j_birch/plugins/superfish/
 **/
 
#navBar {
    width:  60%;
    float: left;
    margin-top: 5px;
}

.sf-menu {
    float:          left;
    margin-bottom:  0;
}

.sf-menu a, .sf-menu div {
    border-left:    1px solid #FFFFFF;
    border-top:     1px solid #FFFFFF;
    padding:        .25em .5em;
    text-decoration: none;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
    color:          #1645ae;
}
.sf-menu li {
    background:     #FFFFFF;
    
}
.sf-menu li li {
    background:     #e5e9f5;
}
.sf-menu li li li {
    background:     #e5e9f5;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
    background:     #C5D3FF;
    outline:        0;
}

.sf-sub-indicator {
    background:     url('../images/superfish/arrows-000000.png') no-repeat -10px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}

a > .sf-sub-indicator {  /* give all except IE6 the correct values */
    top:            .3em;
    background-position: 0px -100px; /* use translucent arrow for modern browsers*/
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
    background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
    background-position: -10px 0; /* arrow hovers for modern browsers*/
}

.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
    left:           0;
    top:            1.5em; /* match top ul list item height */
    z-index:        99;
}